<header class="hero-4" title="hero-4">
 
 <div class="container">
    <div class="row align-items-center justify-content-center text-center">
      <div class="col-lg-8" data-aos="fade-up" data-aos-delay="100">
        <h1 class="heading text-white mb-3 display-4">The next generation website builder</h1>
        <h4 class="subheading text-white mb-5">Powerful and easy to use drag and drop website builder for blogs, presentation or ecommerce stores.</h4>
        
        <img width="350" src="img/demo/video-1.jpg" class="shadow img-thumbnail">
        
        <div class="buttons">
			
		  <a href="https://www.vvveb.com" class="btn btn-success text-white btn-lg">
			<span>⚡</span>
			<span>Free Download</span>
			<b>›</b>
		  </a>
		  <a href="https://demo.vvveb.com" class="btn btn-white text-white btn-lg">Live Demo</a>
			
        </div>
      </div>
    </div>
  </div>
  
    <div class="separator bottom">
		
		<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 41" width="100%" preserveAspectRatio="none"><defs><style>.cls-1{fill:var(--bs-body-bg);}</style></defs><title>rough-edges-bottom</title><path class="cls-1" d="M0,185l125-26,33,17,58-12s54,19,55,19,50-11,50-11l56,6,60-8,63,15v15H0Z" transform="translate(0 -159)"/></svg>
		
    </div>

   <div class="overlay">
    </div>

   <div class="background-container">
		<img src="img/demo/hero-3.jpg" alt="Hero background">
	</div>
</header>
